<template>
  <div>
    <query-table ref="report_query_table" :page-size="20" :columns="columns"
                 :append-buttons="appendQueryButtons" :query-fields="queryFields"
                 base-url="/project/report" v-loading="isLoading"
                 selectable show-index/>

    <el-dialog width="50%" title="上传文件"   :visible="uploadDlgVisible"
               :close-on-click-modal="false" @close="uploadDlgVisible=false">
      <div v-if="projectDataList.length>0 || planDataList.length>0">
        <custom-field-form :data="uploadConditon" :fields="[
        {
          id: 'planId',
          name: '方案名称',
          defaultValue:planDataList[0].id,
          component:{
            id:'data-select',
            data: this.planDataList,
            change:(val) =>{this.targetPlanId = val}
            },
          colSpan: 10
        },

      ]"></custom-field-form>
      </div>
      <span slot="footer">
        <el-button v-if=""
                   type="primary" size="mini" @click="uploadFile">确认上传</el-button>
      </span>
      <el-row>
        <el-col :span="12">
          <upload-dragger :file-list="uploadFileList" accept=".doc,.docx,.ppt,.pptx" title="只能上传一个文件
       " :show-file-list="false" limit="1"/>
        </el-col>
        <el-col :span="12">
          <upload-dragger :file-list="uploadFileList" accept=".doc" title="文件列表" :show-file-list="true" limit="1"/>
        </el-col>
      </el-row>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "ReportManage",
  data() {
    return {
      uploadConditon: {},
      uploadDlgVisible: false,
      uploadFileList: [],
      uploadDisable: true,
      planDataList: [],
      targetPlanId:'',
      projectDataList: [],
      columns: [
        {id: 'name', name: '文件名称', width: 400,},
        {id: 'projectName', name: '方案名称', align: 'left'},
        {id: 'fileType', name: '文档类型', width: 150, showOverflowTooltip: true},
        {
          id: 'createTime', name: '创建时间', width: 150, formatter: (value) => {
            if (value === null) {
              return ''
            }
            let dt = new Date(value)
            return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate();
          }
        },
        {id: 'createUser', name: '创建人', type: 'user', width: 120, showOverflowTooltip: true},
        {
          id: 'operation', name: '操作', type: 'button', width: 220, children: [
            {
              text: '下载', type: 'primary', click: (row) => {
                window.open(this.$ctx+'/project/report/download?planId=' + row.sourceId);
              }
            },
            {
              text: '删除', type: 'danger', click: (row) => {
                this.delFile(row)
              },isHide:()=>{return !this.checkPermission("report:delete")}
            },
          ]
        },
      ],
      queryFields: [
        {id: 'projectName', name: '方案名称', colSpan: 5},
        {id: 'year', name: '年度', component: 'year-picker', colSpan: 5},
        {id: 'buildOffice', name: '建设单位', component:{id:'company-select',hideRoot:true}, colSpan: 5},
        // {id: 'poolType', name: '油藏类型', component: {id: 'meta-select', type: 'pool-type'}, colSpan: 5},
        /*{id: 'fileType', name: '文件类型', component: {id: 'meta-select', type: 'file-type'}, colSpan: 6},*/
      ],
      appendQueryButtons: [
        {
          text: '上传', type: 'success', isHide: () => {
            return  !this.checkPermission("report:upload")
          }, click: ()=>{this.uploadDlgVisible = true}
        },
      ],
      isLoading: false

    }
  },
  created() {
    this.$get("/plan_info/nameList", {}, (res) => {
      this.planDataList = res.data;
      if (this.planDataList && this.planDataList[0]) {
        this.targetPlanId = this.planDataList[0].id
      }
      console.log('planDataList', this.planDataList)
    })
  },
  methods: {

    uploadFile() {

      if (this.uploadFileList.length == 0) {
        this.$message.warning("请先上传文档")
        return
      }
      if (!this.uploadConditon['planId']) {
        this.$message.warning("请先选择方案")
        return
      }
      const loading = this.openLoading("正在上传请稍后...");
      let split = this.uploadFileList[0].name.split('.');
      console.log('split', split)

      if (!split || split.length <= 1) {
        this.$message.warning('文件类型不符合,仅支持ppt,pptx,doc,docx类型')
        loading.close()
        return false
      }
      let tag = ''
      if (split[split.length-1] == 'doc' || split[1] == 'docx') {
        tag = 'word'
      } else if(split[1] == 'ppt' || split[1] == 'pptx') {
        tag = 'ppt'
      } else {
        this.$message.warning('文件类型不符合,仅支持ppt,pptx,doc,docx类型')
        loading.close()
        return
      }
      let fileId = this.uploadFileList[0].id
        let fileDTO = {
          userId: this.$store.state.user.id,
          dataId: this.targetPlanId,
          fileIdSet:[fileId],
          tag:tag,
          fileSource: 'report',
          name:this.uploadFileList[0].name
        }

        this.$post("/project/report/save",fileDTO,(res) =>{
          this.$refs['report_query_table'].reload();
          this.uploadDlgVisible=false;
          this.$message.success('文件上传成功');
          this.uploadFileList=[];
        },(hook)=>{
          loading.close()
        })
    },
    delFile(row) {
      this.$post("/file/delete/" + row.id, {}, (res) => {
        this.$message.success("删除成功");
        this.$refs['report_query_table'].reload();
      })
    }
  }
}
</script>

<style scoped>

</style>